/*
 * @Description: 层级列表
 * @Author: Rfan
 * @Date: 2022-01-25 18:02:15
 * @LastEditTime: 2023-02-08 09:44:11
 */

import { useMemo, useState } from 'react';
import { Button, Divider } from 'antd';
import classNames from 'classnames/bind';
import { fetchArchivesLevelWithPage, fetchDownLevelList } from '@/api/archives/archives';
import { selectItemByKey } from '@/utils/list';
import { useArrangementContext } from '../contexts/ArrangementContext';
import LevelTable from '@/components/LevelTable';
import ConversionOpt from './dialogs/Conversion';
import AddArchiveItem from '@/components/LevelTable/componentes/optBtns/AddArchiveItem';
import type { IArchiveType, ILevel } from '@/interfaces/archiveType';
import styles from '../styles/fileLevelTable.module.scss';
import LinkResourceBtn from '@/components/LevelTable/componentes/optBtns/LinkResource';

const cx = classNames.bind(styles);

interface IRecordLevelTableProps {
  fondId: number;
  atItem: IArchiveType;
  level: ILevel;
}

const RecordLevelTable = (props: IRecordLevelTableProps) => {
  const { fondId, atItem, level } = props;
  const { selectFile, setSelectFile } = useArrangementContext();

  console.log({ fondId, atItem, level, selectFile });

  // 电子文件级层级信息
  const [eRecordInfo, setERecordInfo] = useState<any>({ downLevel: {}, upper: {} });

  /**
   * @description: RecordTable 文件表格变动触发方法
   */
  const recordSelectChange = (downLevel: number, upper: any) => {
    console.log('table', downLevel);
    setERecordInfo({ downLevel, upper });
  };

  /**
   * @description: eFileTable 文件表格变动触发方法
   */
  const eFileSelectChange = () => {
    console.log('recordSelectChange');
  };

  return (
    <div className={cx('file-pane')}>
      {useMemo(
        () => (
          <LevelTable
            base={{
              ...atItem,
              ...level,
              fondId,
              param: {
                atCode: atItem.atCode,
                atType: atItem.atType,
                level: 1,
                commonParams: {
                  dbName: 'single_file'
                }
              }
            }}
            type={0}
            fetchMethod={fetchArchivesLevelWithPage}
            selectChange={recordSelectChange}
            title="散文件管理"
            operates={[
              <AddArchiveItem
                coordinate={{
                  atCode: atItem.atCode,
                  atType: atItem.atType,
                  level: 1
                }}
                dbName="single_file"
                onSave={(data: any) => {
                  console.log('save data', data);
                }}
              />,
              <Button key="delete">删除</Button>,
              <Button key="edit">修改</Button>,
              <ConversionOpt key="conversion" info={{}} />,
              // <ChangeOrderOpt key="changeOrder" info={{}} />,
              <Button key="electric">电子文件</Button>,
              <Button key="more">更多</Button>,
              <Divider key="divider" type="vertical" />,
              <Button key="search">筛选检索</Button>
            ]}
            onSelectChange={setSelectFile}
          />
        ),
        [atItem, fondId]
      )}
      <div className={cx('file-pane')}>
        {useMemo(
          () => (
            <LevelTable
              base={{
                fondId,
                ...atItem,
                ...((selectItemByKey(
                  eRecordInfo.downLevel.level,
                  atItem?.levelList || [],
                  'level'
                ) || eRecordInfo.downLevel) as ILevel),
                param: eRecordInfo.downLevel
                  ? { ...eRecordInfo.downLevel, downLevelId: eRecordInfo.upper?.row_id }
                  : null
              }}
              upper={eRecordInfo.upper}
              title=""
              operates={[<LinkResourceBtn />]}
              fetchMethod={fetchDownLevelList}
              selectChange={eFileSelectChange}
            />
          ),
          [eRecordInfo]
        )}
      </div>
    </div>
  );
};

export default RecordLevelTable;
